<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>个人档案首页</title>
    <meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" href="resources/bootstrap/css/bootstrap.min.css">
	<script src="resources/common/jquery/jquery-3.2.1.min.js"></script>
	<script src="resources/bootstrap/js/bootstrap.min.js"></script>
	
	<script src="resources/common/js/bootstrap-table.js"></script>
	<script src="resources/common/js/bootstrap-table-zh-CN.js"></script>
	<link rel="stylesheet" href="resources/common/css/bootstrap-table.css">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
<script type="text/javascript">
	 $(document).ready(function(){
	 	$('#table').bootstrapTable({
		    url: 'person/inter/selectByConditions.do',  
	        method: 'post',  
	        dataType: "json",  
	        striped: true,//设置为 true 会有隔行变色效果  
	        undefinedText: "",//当数据为 undefined 时显示的字符  
	        pagination: true, //分页  
	        // paginationLoop:true,//设置为 true 启用分页条无限循环的功能。  
	        showToggle: "true",//是否显示 切换试图（table/card）按钮  
	        showColumns: "true",//是否显示 内容列下拉框  
	        pageNumber: 1,//如果设置了分页，首页页码  
	        showPaginationSwitch:true,//是否显示 数据条数选择框  
	        pageSize: 1,//如果设置了分页，页面数据条数  
	        pageList: [5, 10, 20, 40],  //如果设置了分页，设置可供选择的页面数据条数。设置为All 则显示所有记录。  
	        paginationPreText: '‹',//指定分页条中上一页按钮的图标或文字,这里是<  
	        paginationNextText: '›',//指定分页条中下一页按钮的图标或文字,这里是>  
	        // singleSelect: false,//设置True 将禁止多选  
	        search: true, //显示搜索框  
	        data_local: "zh-US",//表格汉化  
	        sidePagination: "server", //服务端处理分页  
	        queryParams: function (params) {//自定义参数，这里的参数是传给后台的，我这是是分页用的  
	            return {//这里的params是table提供的  
	                cp: params.offset,//从数据库第几条记录开始  
	                ps: params.limit//找多少条  
	            };  
	        },  
	        idField: "id",//指定主键列  
	        columns: [  
	            {  
	                title: '编号',//表的列名  
	                field: 'id',//json数据中rows数组中的属性名  
	                align: 'center'//水平居中  
	            },  
	            {  
	                title: '姓名',  
	                field: 'name',  
	                align: 'center'  
	            },  
	            {  
	                title: '电话',  
	                field: 'tel',  
	                align: 'center'  
	            }
	        ]  
		});
	 });
</script>
<body>
	<div style="height: 60%">
		<table id="table"></table>
	</div>
	<div></div>
</body>
</html>
